<template>
	<view class="clearfix overflow-x-hidden">
		<u-keyboard mode="car " v-model="show4car" :mask="false" @change="valChange2" @backspace="backspace2">
		</u-keyboard>

		<uni-steps active-color="#f83d38"
			:options="[{title: '保费试算'}, {title: '补充资料'}, {title: '身份验证'}, {title: '更新资料'}, {title: '完成投保'}]" :active="0"></uni-steps>

		<uni-card class="card-pub" :title="carInfo.fullName" :isShadow="true">
			<uni-row>
				<uni-col :span="12">
					初登日期: {{baseInfo.chudrq}}
				</uni-col>
				<uni-col :span="12">
					行驶里程: {{baseInfo.xingslc}} 公里
				</uni-col>
			</uni-row>
		</uni-card>

		<uni-card class="font-bold-title" title="核心保障" mode="title" :extra="hexbz" note="Tips" :isShadow="true">
			<uni-row class="block-margin">
				<uni-col :span="12">
					赔付限额
				</uni-col>
				<uni-col :span="12">
					<view class="clearfix text-right" decode="true">{{carInfo.price}}&nbsp;万</view>
				</uni-col>
			</uni-row>
			<uni-row v-if="taocList.length > 0">
				<uni-col :span="12">
					会员福利
				</uni-col>
				<uni-col class="text-right" :span="12">
					<view class="clearfix text-right">
						<uni-row class="text-right opacity8 margin10B" v-for="(item,index) in taocList">
							{{item.xiangmmc}}, {{item.shuom}}
						</uni-row>
					</view>
				</uni-col>
			</uni-row>

			<template v-slot:footer>
				<view>
					<uni-row>
						<uni-col :span="12" class="marign10T">
							售价
						</uni-col>
						<uni-col :span="12">
							<view class="clearfix text-right" decode="true">
								<span class="font-orange-num">{{felb.premium}}&nbsp;元</span>
							</view>
						</uni-col>
					</uni-row>
				</view>
			</template>
		</uni-card>
		
		<uni-card class="font-bold-title" title="升级保障" mode="title" :isShadow="true">
			<radio-group @change="radioChange">
				<label class="uni-list-cell pos-rel uni-list-cell-pd margin5" v-for="(item, index) in beixList"
					:key="index">
					<view class="fxl btn-radio wid120 fs14" :class="index===current?'focus':''">
						<radio v-show=false :value="item.premium" />{{item.chanpmc}}
					</view>
					<button type="warn" class="fxr margin10T"  size="mini" @click="productDetail(item.productId)">详情</button>
				</label>
			</radio-group>
			
		</uni-card>
		

		<uni-section class="pub-title" title="车辆信息" type="line"></uni-section>
		<uni-card :isShadow="true">
			<uni-forms-item label="车牌号" required>
				<uni-easyinput type="text" v-model="formData.cheph" placeholder="请输入车牌号" :inputBorder="true"
					@iconClick="showKeyboard('car')" suffixIcon="gear" />
			</uni-forms-item>
		</uni-card>
		
		<view style="color: #ffffff;">
			<p>1</p>
			<p>1</p>
			<p>1</p>
			<p>1</p>
			<p>1</p>
			<p>1</p>
			<p>1</p>
			<p>1</p>
			<p>1</p>
			<p>1</p>
			<p>1</p>
			<p>1</p>
		</view>
		
		<button @click="submitForm" class="btn-red bottom-btn border-no">支付</button>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				hexbz: uni.getStorageSync("baseInfo").level2Sku_fy + ", " + uni.getStorageSync("baseInfo").level4Sku_fy,
				beixList: uni.getStorageSync("beixList"),
				current: 0,
				show4car: false,
				formData: {
					cheph: uni.getStorageSync("carInfo").cheph == null ? "" : uni.getStorageSync("carInfo").cheph,
					chejh: uni.getStorageSync("carInfo").vin,
					fadjh: uni.getStorageSync("carInfo").fadjh,
				},

				baseInfo: uni.getStorageSync("baseInfo"),
				carInfo: uni.getStorageSync("carInfo"),
				felb: uni.getStorageSync("feilb"),
				product: null,
				taocList: uni.getStorageSync("taocList")
			}
		},
		
		onLoad() {
			let that = this
			that.getChanpById(uni.getStorageSync("product").chanpid)
			
			this.beixList.forEach((item, index) => {
				if(item.premium == this.felb.premium)
					this.current = index
			})
		},

		methods: {
			productDetail(productId) {
				uni.navigateTo({
					url: '../../pages2/productDetail/productDetail?productId=' + productId
				})
			},
			
			getChanpById(productId) {
				let that = this
				
				uni.request({
					url: getApp().globalData.serviceUrl + "/chanp/kuybChanp/queryById",
					data: {
						id: productId
					},
					method: 'GET',
					success: (resp) => {
						if (resp.data.success) {
							that.product = resp.data.result
						}
					}
				})
			},
			
			radioChange: function(evt, b) {
				for (let i = 0; i < this.beixList.length; i++) {
					if (this.beixList[i].premium == evt.detail.value) {
						this.current = i;
						this.felb.premium = evt.detail.value
						
						this.getChanpById(this.beixList[i].productId)
						
						break;
					}
				}
			},
			
			payment() {
				let that = this

				uni.requestSubscribeMessage({
					tmplIds: ['LWpG_Z7ky9l4qW5N9VaCcoVhlfuS18PY_q_MF3oIscw'],
					success(res) {
						uni.request({
							url: getApp().globalData.serviceUrl + "/weixin/getPrepayIdAndPaySign",
							data: {
								dingdbh: uni.getStorageSync("selectedOrder").dingdbh,
								productName: uni.getStorageSync("product").chanpmc,
								dingdje: uni.getStorageSync("selectedOrder").dingdje,
								openId: uni.getStorageSync("userInfo").openId
							},
							header: {
								"X-Access-Token": uni.getStorageSync("token")
							},
							method: 'POST',
							dataType: 'json',
							success: (resp) => {
								if (resp.data.success) {
									uni.requestPayment({
										provider: 'wxpay',
										timeStamp: resp.data.result.timeStamp,
										nonceStr: resp.data.result.nonceStr,
										package: 'prepay_id=' + resp.data.result.prepay_id,
										signType: 'RSA',
										paySign: resp.data.result.paySign,

										// timeStamp: "1632321294",
										// nonceStr: "97d92c48c4ec432eaaee00ee802f6b66",
										// package: "prepay_id=wx22223452765071c4b0b27aae5c09300000",
										// paySign: "WAF+E9mwrKufJsim5hA+ybqILBZNTZzz9Lnc6Oom/DIrTQ/bqwYNxG9VTTEeLgPeFDPLgAOedruIKRtr84RFfGFx0u+nm36pV1xq3es2aLlQh3LAje4SajFe/vzRB82Gqn1oTG6oTI0/jZs6OZ8u4SLoB2XxB0mrCu5T+ilQ6VwS4rRRzY3VGy9Y4XMzYXAjhFPel+0iSjnQdo8tyhDUSJb8UMm9U02khNKivXODF7QQ6YC2bOj442eOZ7I8yp586eOJAFzX6UnQ2kf3lPz6VrFZGl0iHnPyLU9ShZzLMJ0NyZgnGFSlFXf80xQLUuzKaq2lGDLwaAGaZJeyAF/89A==",
										// signType: 'RSA',

										success: function(res) {
											console.log('success:' + JSON.stringify(res));
											uni.navigateTo({
												url: '../../pages2/toubrxx/toubrxx'
											})

										},
										fail: function(err) {
											console.log('fail:' + JSON.stringify(err));
										}
									});
									
								} else {
									uni.showToast({
										title: resp.data.message,
										icon: 'none'
									});
								}
							}
						})
					}
				})
			},

			showKeyboard(type) {
				if (type == "car")
					this.show4car = true
			},

			// 按键被点击(点击退格键不会触发此事件)
			valChange2(val) {
				// 将每次按键的值拼接到value变量中，注意+=写法
				this.formData.cheph += val;
				console.log(this.value);
			},
			// 退格键被点击
			backspace2() {
				// 删除value的最后一个字符
				if (this.formData.cheph.length)
					this.formData.cheph = this.formData.cheph.substr(0, this.formData.cheph.length - 1);

			},

			submitForm() {
				let that = this

				if (this.formData.cheph == "") {
					uni.showToast({
						title: '车牌号必填!',
						icon: 'none'
					});
					return
				}

				if (this.formData.chejh == "") {
					uni.showToast({
						title: '车架号必填!',
						icon: 'none'
					});
					return
				}

				if (this.formData.fadjh == "") {
					uni.showToast({
						title: '发动机号必填!',
						icon: 'none'
					});
					return
				}

				let carInfo = uni.getStorageSync("carInfo")
				carInfo.cheph = this.formData.cheph
				carInfo.vin = this.formData.chejh
				carInfo.fadjh = this.formData.fadjh
				uni.setStorageSync("carInfo", carInfo)

				uni.showLoading({
					title: '加载中...'
				});
				uni.request({
					url: getApp().globalData.serviceUrl + "/order/kuybOrder/add",
					data: {
						dingdje: this.felb.premium * 100,
						//dingdje: 1,
						openId: uni.getStorageSync("openId").openid,
						kuybOrderChanpList: [{
							chanpid: that.product.id,
							chanpmc: that.product.chanpmc,
							chanpzt: that.product.chanpzt,
							chanpms: that.product.chanpms,
						}],
						kuybOrderPolicyList: [{
							level1Sku: uni.getStorageSync("baseInfo").level1Sku,
							level2Sku: uni.getStorageSync("baseInfo").level2Sku,
							level3Sku: uni.getStorageSync("baseInfo").level3Sku,
							level4Sku: uni.getStorageSync("baseInfo").level4Sku,
							
							// beibxr: uni.getStorageSync("toubrxx").name,
							bebxcph: uni.getStorageSync("carInfo").cheph,
							// beibxrlxdh: uni.getStorageSync("toubrxx").mobile,
							// beibxr: uni.getStorageSync("toubrxx").name,
							// beibxrzjhm: uni.getStorageSync("toubrxx").zhengjhm,
							// chejh: uni.getStorageSync("carInfo").vin,
							// fadjh: uni.getStorageSync("carInfo").fadjh,
							chudrq: uni.getStorageSync("baseInfo").chudrq,
							xingslc: uni.getStorageSync("baseInfo").xingslc,
							chelmc: uni.getStorageSync("baseInfo").carFullName,
							beibxryx: uni.getStorageSync("toubrxx").email,
							peifxe: uni.getStorageSync("carInfo").price,
							productId: that.product.id,
							openId: uni.getStorageSync("openId").openid,
							nengylx: uni.getStorageSync("carInfo").nengylx,
							carid: uni.getStorageSync("carInfo").id
						}]
					},
					dataType: 'json',
					method: 'POST',
					header: {
						"X-Access-Token": uni.getStorageSync("token")
					},
					success: (result) => {
						uni.hideLoading()

						if (result.data.success) {
							uni.setStorageSync("selectedOrder", result.data.result)
							that.payment()
							
						} else {
							uni.showToast({
								title: result.data.message,
								icon: 'none'
							});
						}
					}
				});

			},

		}
	}
</script>

<style scoped>
		
</style>
